import 'package:flutter/material.dart';
import 'package:provider/provider.dart';
import 'package:social_module/viewmodel/list_provider.dart';

class SocialMainPage extends StatefulWidget {
  const SocialMainPage({Key? key}) : super(key: key);

  @override
  _SocialMainPageState createState() => _SocialMainPageState();
}

class _SocialMainPageState extends State<SocialMainPage> {
  @override
  void initState() {
    super.initState();
    context.read<ListProvider>().init();
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        backgroundColor: Color.fromARGB(255, 80, 196, 211),
        title: Text("社区"),
        centerTitle: true,
      ),
      body: Column(
        children: [
          Expanded(
            child: Container(
              margin: EdgeInsets.only(
                  left: 5.0, right: 5.0, top: 10.0, bottom: 10.0),
              decoration: BoxDecoration(
                borderRadius: BorderRadius.circular(10.0),
                color: const Color.fromARGB(255, 80, 196, 211),
              ),
              child: Center(
                child: Text(
                  "欢迎来到社区，在这里你可以分享你的学习心得！",
                  style: TextStyle(
                    fontWeight: FontWeight.w200,
                    color: Colors.white,
                  ),
                ),
              ),
            ),
            flex: 1,
          ),
          Expanded(
            flex: 8,
            child: Scrollbar(
              child: RefreshIndicator(
                onRefresh: _onRefresh,
                child: ListView.builder(
                  itemBuilder: (BuildContext context, int index) {
                    return _buildItem(
                        Provider.of<ListProvider>(context).list[index]);
                  },
                  itemCount: Provider.of<ListProvider>(context).list.length,
                ),
              ),
            ),
          ),
        ],
      ),
      floatingActionButton: FloatingActionButton.extended(
        onPressed: () {
          Navigator.of(context).pushNamed("/add");
        },
        backgroundColor: const Color.fromARGB(255, 80, 196, 211),
        tooltip: '',
        icon: const Icon(Icons.add),
        label: const Text("写心得"),
      ),
    );
  }

  _buildItem(List list) {
    return Container(
        margin: EdgeInsets.only(bottom: 10.0, left: 5.0, right: 5.0),
        padding:
            EdgeInsets.only(left: 10.0, right: 10, top: 10.0, bottom: 10.0),
        decoration: BoxDecoration(
          border: Border.all(color: Colors.grey, width: 2.5),
          borderRadius: BorderRadius.circular(10.0),
          // color: Colors.blue
        ),
        child: Column(
          children: [
            Row(
              children: <Widget>[
                Expanded(
                    child: Text(
                  "${list[0]}",
                  style: TextStyle(
                      fontSize: 16.0,
                      fontWeight: FontWeight.bold,
                      color: Colors.blueGrey),
                )),
                Column(
                  mainAxisSize: MainAxisSize.max,
                  mainAxisAlignment: MainAxisAlignment.center,
                  children: [
                    Text(
                      "${list[1]}",
                      style: TextStyle(fontSize: 12.0, color: Colors.black54),
                    ),
                  ],
                )
              ],
            ),
            Container(
              margin: EdgeInsets.only(top: 10.0, bottom: 10.0),
              child: Row(
                children: <Widget>[Expanded(child: Text("  " "${list[2]}"))],
              ),
            ),
            // const Divider(
            //   height: 5.0,
            //   thickness: 1.0,
            //   indent: 0.0,
            //   color: const Color.fromARGB(255, 80, 196, 211),
            // ),
          ],
        ));
  }

  Future _onRefresh() async {
    await Future.delayed(Duration(milliseconds: 500), () {
      context.read<ListProvider>().getList();
    });
    return "";
  }
}
